{% extends 'index.twig' %}

{% block content %}
<!-- Banner Wrapper -->
<div id="banner-wrapper">

	<!-- Banner -->
		<div class="container">
			<div id="banner">
				<div class="viewer">
					<div class="nav-next"></div>
					<div class="nav-previous"></div>
					<div class="reel">
						{% set slideData = app.generic.modelData('Homepage slideshow', '', [], { sort: 'rank', order: 'ASC' }) %}
						{% for itm in slideData['_data'] %}
						<!-- Slide 1 -->
							<div class="slide">
								<h2 class="caption-1">{{ itm.labels|langdata(lang)|raw }}</h2>
								<p class="caption-2">{{ itm.description|langdata(lang)|raw }}</p>
								<a href="#" class="link">More ...</a>
								<img src="{{ itm.image|imgsrc|replace({ '950' : '1200' }) }}" alt="" />
							</div>
						{% endfor %}
					</div>
				</div>
				<div class="captions">
					<span class="caption-line-1"></span>
					<span class="caption-line-2"></span>
				</div>
			</div>
		</div>
		
</div>

<!-- Search Wrapper -->
<div id="search-wrapper">
	
	<!-- Search -->
		<div class="container" id="search">
			<span>{{ pageTitle }}</span>
			<div class="row">
				<div class="-8u 4u">
					<div class="side-padded">
						<form method="post" action="#">
							<div>
								<input type="text" class="text" name="search" placeholder="Search our site" />
								<input type="submit" value="Search" class="button" />
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
		
</div>
	
<!-- Main -->
<div id="main-wrapper">
	<div class="container">
		<div class="row">
			<div class="8u important(collapse)">
				
				<!-- Content -->
					<div id="content">
					
						<!-- Article -->
							<article class="featured">
								{% set catData = app.generic.modelData('News category', 'entity.id = 501', []) %}
								<header>
									<h2>{{ catData['_data'][0]['labels']|langdata(lang)|raw }}</h2>
									<span class="byline">{{ catData['_data'][0]['description']|langdata(lang)|raw }}</span>
								</header>
								<div class="grid-spaced">
									{% set count = 0 %}
									{% for itm in newsData['_data'] %}
										{% if count < 4 %}
											{% if itm.category|hasVal(catData['_data'][0]['id']) %}
												{% if count % 2 == 0 %}
													{% if count != 0 %}
														</div>
													{% endif %}
												<div class="row">
												{% endif %}
												{% set count = count + 1 %}
												<div class="6u"><section>
													<a href="/{{ lang }}/news/?id={{ itm.id }}" class="image image-fit"><img style="height: 265px;" src="{{ itm.image|imgsrc|replace({ '950' : '400' }) }}" alt="" /></a>
													<h3>{{ itm.labels|langdata(lang)|raw }}</h3>
													<p>{{ itm.description|langdata(lang)|raw }} <a href="/{{ lang }}/news/?id={{ itm.id }}">Learn more ...</a></p>
												</section></div>
											{% endif %}
										{% endif %}
									{% endfor %}
									{% if count % 2 == 1 %}
									</div>
									{% endif %}
								</div>
							</article>
					
						<!-- Section 1 -->
							<section>
								{% set catData = app.generic.modelData('News category', 'entity.id = 502', []) %}
								<header>
									<h2>{{ catData['_data'][0]['labels']|langdata(lang)|raw }}</h2>
									<span class="byline">{{ catData['_data'][0]['description']|langdata(lang)|raw }}</span>
								</header>
								{% set count = 0 %}
								{% for itm in newsData['_data'] %}
									{% if count < 1 %}
										{% if itm.category|hasVal(catData['_data'][0]['id']) %}

											{% set count = count + 1 %}
												<a href="/{{ lang }}/news/?id={{ itm.id }}" class="image image-style1 align-left image-fit-mobileOnly"><img style="height: 300px;" src="{{ itm.image|imgsrc|replace({ '950' : '400' }) }}" alt="" /></a>
												<h3>{{ itm.labels|langdata(lang)|raw }}</h3>
												<p>{{ itm.description|langdata(lang)|raw }}</p>
												<a href="/{{ lang }}/news/?id={{ itm.id }}">Learn more ...</a>
										{% endif %}
									{% endif %}
								{% endfor %}

								<div>&nbsp;</div>
							</section>

						<!-- Section 2 -->
							<section>
								{% set catData = app.generic.modelData('News category', 'entity.id = 503', []) %}
								<header>
									<h2>{{ catData['_data'][0]['labels']|langdata(lang)|raw }}</h2>
									<span class="byline">{{ catData['_data'][0]['description']|langdata(lang)|raw }}</span>
								</header>
								<div class="grid-spaced">
									{% set count = 0 %}
									{% for itm in newsData['_data'] %}
										{% if count < 6 %}
											{% if itm.category|hasVal(catData['_data'][0]['id']) %}
												{% if count % 2 == 0 %}
													{% if count != 0 %}
														</div>
													{% endif %}
												<div class="row">
												{% endif %}
												{% set count = count + 1 %}
												<div class="6u"><section>
													<a href="/{{ lang }}/news/?id={{ itm.id }}" class="image image-style2 align-left"><img style="height: 100px;" src="{{ itm.image|imgsrc|replace({ '950' : '150' }) }}" alt="" /></a>
													<h3>{{ itm.labels|langdata(lang)|raw }}</h3>
													<p>{{ itm.description|langdata(lang)|raw }} <a href="/{{ lang }}/news/?id={{ itm.id }}">Learn more ...</a></p>
												</section></div>
											{% endif %}
										{% endif %}
									{% endfor %}
									{% if count % 2 == 1 %}
									</div>
									{% endif %}
								</div>
							</section>
					
					</div>

			</div>
			<div class="4u">
				<div class="right-sidebar">

					<!-- Sidebar -->
						<div id="sidebar">
						
							<!-- Section 1 -->
								<section class="blocks">
									{% set subData = app.generic.modelData('Homepage submenu', '', [], { sort: 'rank', order: 'ASC' }) %}
									{% for itm in subData['_data'] %}
									<!-- Slide 1 -->
										<a href="/{{ lang }}/{{ itm.url }}/" class="{{ loop.index|num2word }}">
											<h2>{{ itm.labels|langdata(lang)|raw }}</h2>
											<p>{{ itm.description|langdata(lang)|raw }}</p>
										</a>
									{% endfor %}
								</section>

							<!-- Section 2 -->
								<section>
									<header>
										<h2>我们的友情链接</h2>
									</header>
									<ul class="style1 posts">
										{% set linkData = app.generic.modelData('Useful link', '', [], { sort: 'rank', order: 'ASC' }) %}
										{% for itm in linkData['_data'] %}
											<li>
												<a href="//{{ itm.url }}" taget="_blank" class="image align-left"><img style="width: 70px;" src="{{ itm.image|imgsrc|replace({ '950' : '150' }) }}" alt="" /></a>
												<h3>{{ itm.labels|langdata(lang)|raw }}</h3>
												<p>{{ itm.url }}</p>
											</li>
										{% endfor %}
									</ul>
									<a href="/{{ lang }}/useful-links/" class="button">More...</a>
								</section>

							<!-- Section 3 -->
								<section>
									<header>
										<h2>{{ testimonials }}</h2>
									</header>
									<ul class="style1 tweets">
										{% set testiData = app.generic.modelData('Testimonial', '', [], { sort: 'rank', order: 'ASC' }) %}
										{% for itm in testiData['_data'] %}
											<li>
												<p>{{ itm.content|langdata(lang)|raw }}</p>
												<span class="date">{{ "now"|date("d M Y") }}</span>
											</li>
										{% endfor %}
									</ul>
								</section>
						
						</div>
				
				</div>
			</div>
		</div>
	</div>
</div>
{% endblock %}